/** 
  项目报告与经费报销
*/
<template>
    <div class="edu-page-warp topic-info">
        <div class="project-application-container" style="height: 30px;">
            <el-breadcrumb style="float: left;" separator="/">
                <el-breadcrumb-item :to="{ path: '/AppListOfIntAcaCon' }">
                    <span @click="returnList">国际学术会议基金申请</span>
                </el-breadcrumb-item>
                <el-breadcrumb-item>
                    <span v-if="getSubmitType === 'add'">回国报销 申请</span>
                    <span v-else-if="getSubmitType === 'edit'">回国报销 编辑</span>
                    <span v-else-if="getSubmitType === 'view'">回国报销 查看</span>
                </el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <el-card shadow="never">
            <el-button style="float:right" @click="returnList">返回</el-button>
            <span class="top-title">
                <h3>国际学术会议基金申请-回国报销</h3>
            </span>
            <hr />
            <el-form
                :model="proForm"
                ref="proForm"
                :rules="baseInfoRules"
                label-position="right"
                label-suffix="："
                v-if="isExpand"
            >
                <span class="topic-form-title">
                    <h3>出访时间</h3>
                </span>
                <el-row :gutter="24">
                    <el-col :span="6">
                        <el-form-item label="计划出发时间" prop="conferenceStartTime">
                            <el-date-picker
                                v-model="proForm.conferenceStartTime"
                                type="date"
                                class="topic-input-select"
                                disabled
                                value-format="yyyy-MM-dd HH:mm:ss"
                            ></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="计划回国时间" prop="conferenceEndTime">
                            <el-date-picker
                                v-model="proForm.conferenceEndTime"
                                type="date"
                                class="topic-input-select"
                                disabled
                                value-format="yyyy-MM-dd HH:mm:ss"
                            ></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="实际出发时间" prop="realLeaveTime">
                            <el-date-picker
                                v-model="proForm.realLeaveTime"
                                type="date"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                :picker-options="startDatePicker"
                                value-format="yyyy-MM-dd HH:mm:ss"
                            ></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="实际回国实际" prop="realBackTime">
                            <el-date-picker
                                v-model="proForm.realBackTime"
                                type="date"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                :picker-options="endDatePicker"
                                value-format="yyyy-MM-dd HH:mm:ss"
                            ></el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="6">
                        <el-form-item label="实际宣读/海报时间" prop="realReadPosterTime">
                            <el-date-picker
                                v-model="proForm.realReadPosterTime"
                                type="date"
                                :disabled="ifShowDetail"
                                class="topic-input-select"
                                value-format="yyyy-MM-dd HH:mm:ss"
                            ></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="实际宣读/海报题目" prop="realReadPosterSubject">
                            <el-input
                                v-model="proForm.realReadPosterSubject"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                maxlength="32"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="2">
                        <span class="topic-form-title">
                            <h3>费用报销</h3>
                        </span>
                    </el-col>
                    <el-col :span="4">
                        <span style="color:red;line-height:60px">请按照实际情况填写金额及币种</span>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="6">
                        <el-form-item label="国际旅费" prop="internationalTravel">
                            <el-input
                                v-model="proForm.internationalTravel"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                maxlength="32"
                                placeholder="100美元"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="交通费" prop="trafficExpense">
                            <el-input
                                v-model="proForm.trafficExpense"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                maxlength="32"
                                placeholder="100美元"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="住宿费" prop="hotelExpense">
                            <el-input
                                v-model="proForm.hotelExpense"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                maxlength="32"
                                placeholder="100美元"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="会议注册费" prop="registrationFee">
                            <el-input
                                v-model="proForm.registrationFee"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                maxlength="32"
                                placeholder="100美元"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="6">
                        <el-form-item label="签证费用" prop="visaFee">
                            <el-input
                                v-model="proForm.visaFee"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                maxlength="32"
                                placeholder="100美元"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="保险费用" prop="insurancePremium">
                            <el-input
                                v-model="proForm.insurancePremium"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                maxlength="32"
                                placeholder="100美元"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="其他费用" prop="otherExpenses">
                            <el-input
                                v-model="proForm.otherExpenses"
                                class="topic-input-select"
                                :disabled="ifShowDetail"
                                maxlength="32"
                                placeholder="100美元"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="2">
                        <span class="topic-form-title">
                            <h3>学术成果</h3>
                        </span>
                    </el-col>
                    <div
                        style="float:right; padding-right:10px;line-height: 60px;text-align: center;"
                    >
                        <el-button
                            size="small"
                            type="primary"
                            @click="addLine"
                            v-show="!ifShowDetail"
                        >新增</el-button>
                    </div>
                </el-row>

                <el-form
                    :model="diyTable"
                    ref="diyTable"
                    :rules="rulesForm"
                    :disabled="ifShowDetail"
                >
                    <edu-table
                        :pagination="false"
                        :order="false"
                        :tooltipEffect="tooltipEffect"
                        stripe
                        :data="diyTable.achievements"
                        size="mini"
                        :selection="false"
                    >
                        <edu-table-column label="论文名称" prop="thesisName" min-width="110">
                            <template slot-scope="scope">
                                <el-form-item
                                    style="margin-top: 15px;"
                                    :prop="'achievements.' + scope.$index + '.thesisName'"
                                    label-width="0"
                                >
                                    <el-input
                                        v-model.trim="scope.row.thesisName"
                                        maxlength="32"
                                        type="textarea"
                                        clearable
                                        autosize
                                        placeholder="In Situ Selective…"
                                        style="width: 100%"
                                    ></el-input>
                                </el-form-item>
                            </template>
                        </edu-table-column>
                        <edu-table-column label="期刊" prop="periodical" min-width="118">
                            <template slot-scope="scope">
                                <el-form-item
                                    style="margin-top: 15px;"
                                    :prop="'achievements.' + scope.$index + '.periodical'"
                                    label-width="0"
                                >
                                    <el-input
                                        v-model.trim="scope.row.periodical"
                                        maxlength="32"
                                        type="textarea"
                                        clearable
                                        autosize
                                        placeholder="IEEE GEOSCIENCE"
                                        style="width: 100%"
                                    ></el-input>
                                </el-form-item>
                            </template>
                        </edu-table-column>
                        <edu-table-column label="作者排名" prop="authorRanking" min-width="88">
                            <template slot-scope="scope">
                                <el-form-item
                                    style="margin-top: 15px;"
                                    :prop="'achievements.' + scope.$index + '.authorRanking'"
                                    label-width="0"
                                >
                                    <el-input
                                        v-model.trim="scope.row.authorRanking"
                                        clearable
                                        type="textarea"
                                        rows="4"
                                        autosize
                                        maxlength="32"
                                        placeholder="一"
                                        style="width: 100%"
                                    ></el-input>
                                </el-form-item>
                            </template>
                        </edu-table-column>
                        <!-- 收录情况如SCI/EI收录等 -->
                        <edu-table-column
                            :render-header="renderHeader"
                            prop="collection"
                            min-width="140"
                        >
                            <template slot-scope="scope">
                                <el-form-item
                                    style="margin-top: 15px;"
                                    :prop="'achievements.' + scope.$index + '.collection'"
                                    label-width="0"
                                >
                                    <el-input
                                        v-model.trim="scope.row.collection"
                                        clearable
                                        type="textarea"
                                        autosize
                                        maxlength="32"
                                        placeholder="SCI"
                                        style="width: 100%"
                                    ></el-input>
                                </el-form-item>
                            </template>
                        </edu-table-column>
                        <edu-table-column
                            :render-header="renderYear"
                            prop="publishTime"
                            min-width="108"
                        >
                            <template slot-scope="scope">
                                <el-form-item
                                    style="margin-top: 15px;"
                                    :prop="'achievements.' + scope.$index + '.publishTime'"
                                    label-width="0"
                                >
                                    <el-date-picker
                                        v-model="scope.row.publishTime"
                                        value-format="yyyy-MM"
                                        format="yyyy 年 MM 月"
                                        type="month"
                                        placeholder="选择年月"
                                        style="width: 100%"
                                    ></el-date-picker>
                                </el-form-item>
                            </template>
                        </edu-table-column>
                        <!-- 卷/期/页 著作论文填写 -->
                        <edu-table-column
                            :render-header="renderHeader3"
                            prop="issuePage"
                            min-width="126"
                        >
                            <template slot-scope="scope">
                                <el-form-item
                                    style="margin-top: 15px;"
                                    :prop="'achievements.' + scope.$index + '.issuePage'"
                                    label-width="0"
                                >
                                    <el-input
                                        v-model.trim="scope.row.issuePage"
                                        clearable
                                        type="textarea"
                                        autosize
                                        maxlength="32"
                                        placeholder="101(4):632-636"
                                        style="width: 100%"
                                    ></el-input>
                                </el-form-item>
                            </template>
                        </edu-table-column>
                        <!-- 主要合作者 如有校内导师请填写导师姓名 -->
                        <edu-table-column
                            :render-header="renderHeader2"
                            prop="partner"
                            min-width="224"
                        >
                            <template slot-scope="scope">
                                <el-form-item
                                    style="margin-top: 15px;"
                                    :prop="'achievements.' + scope.$index + '.partner'"
                                    label-width="0"
                                >
                                    <el-input
                                        v-model.trim="scope.row.partner"
                                        clearable
                                        type="textarea"
                                        autosize
                                        maxlength="32"
                                        placeholder="谢欢"
                                        style="width: 100%"
                                    ></el-input>
                                </el-form-item>
                            </template>
                        </edu-table-column>
                        <edu-table-column label="语种" prop="languages" min-width="100">
                            <template slot-scope="scope">
                                <el-form-item
                                    style="margin-top: 15px;"
                                    :prop="'achievements.' + scope.$index + '.languages'"
                                    label-width="0"
                                >
                                    <el-input
                                        v-model.trim="scope.row.languages"
                                        clearable
                                        autosize
                                        type="textarea"
                                        maxlength="32"
                                        placeholder="英文"
                                        style="width: 100%"
                                    ></el-input>
                                </el-form-item>
                            </template>
                        </edu-table-column>
                        <edu-table-column
                            prop="address"
                            label="操作"
                            v-if="!ifShowDetail"
                            min-width="70"
                        >
                            <template slot-scope="scope">
                                <el-button
                                    type="text"
                                    @click="deleteRoster(scope.row, scope.$index)"
                                >删除</el-button>
                            </template>
                        </edu-table-column>
                    </edu-table>
                </el-form>
                <el-form
                    ref="fileform"
                    label-position="left"
                    :model="fileform"
                    :rules="fileformRules"
                >
                    <el-row :gutter="24">
                        <el-col :span="2">
                            <span class="topic-form-title">
                                <h3>附件管理</h3>
                            </span>
                        </el-col>
                        <el-col :span="2" class="topic-form-down">
                            <el-button
                                type="text"
                                size="medium"
                                v-show="!ifShowDetail"
                                @click="downLoadModel"
                            >总结模板 下载</el-button>
                        </el-col>
                    </el-row>
                    <el-divider></el-divider>
                    <el-row :gutter="24">
                        <el-col :span="9">
                            <el-form-item
                                label="同济大学研究生赴国外参加国际学术会议总结"
                                class="topic-form-title"
                                label-width="150px"
                                prop="mark1"
                            >
                                <el-upload
                                    v-model="fileform.mark1"
                                    class="upload-demo"
                                    action="/api/commonservice/obsfile/uploadfile"
                                    :data="uploadConfig.data"
                                    :on-exceed="handleExceed"
                                    :before-upload="(file) =>beforeUpload(file, 1)"
                                    :on-success="(response, file, fileList) => handlerUploadSuccess(response, file, fileList, 1)"
                                    :before-remove="(file, fileList) =>handlerBeforeRemove(file, fileList, 1)"
                                    :on-remove="(file, fileList) =>handlerRemove(file, fileList, 1)"
                                    :on-error="(err, file, fileList) =>handlerUploadError(err, file, fileList, 1)"
                                    :on-preview="(file) =>downloadMaterial(file, 1)"
                                    multiple
                                    :limit="1"
                                    :file-list="fileList1"
                                    :disabled="ifShowDetail"
                                >
                                    <el-button
                                        size="small"
                                        type="primary"
                                        v-show="!ifShowDetail"
                                    >{{ $t('base.uploadBtn') }}</el-button>
                                </el-upload>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item
                                label="请上传word版本文件（随附2张jpg格式本人在会场的论文宣读或海报张贴照片），大小不要超过5MB（仅允许一个文件）"
                                class="topic-form-title"
                                label-position="left"
                            ></el-form-item>
                        </el-col>
                    </el-row>
                    <el-divider></el-divider>
                    <el-row :gutter="24">
                        <el-col :span="9">
                            <el-form-item
                                label="成果附件"
                                class="topic-form-title"
                                label-width="150px"
                                prop="mark2"
                            >
                                <el-upload
                                    v-model="fileform.mark2"
                                    class="upload-demo"
                                    action="/api/commonservice/obsfile/uploadfile"
                                    :data="uploadConfig.data"
                                    :on-exceed="handleExceed"
                                    :before-upload="(file) =>beforeUpload(file, 2)"
                                    :on-success="(response, file, fileList) => handlerUploadSuccess(response, file, fileList, 2)"
                                    :before-remove="(file, fileList) =>handlerBeforeRemove(file, fileList, 2)"
                                    :on-remove="(file, fileList) =>handlerRemove(file, fileList, 2)"
                                    :on-error="(err, file, fileList) =>handlerUploadError(err, file, fileList, 2)"
                                    :on-preview="(file) =>downloadMaterial(file, 2)"
                                    multiple
                                    :limit="1"
                                    :file-list="fileList2"
                                    :disabled="ifShowDetail"
                                >
                                    <el-button
                                        size="small"
                                        type="primary"
                                        v-show="!ifShowDetail"
                                    >{{ $t('base.uploadBtn') }}</el-button>
                                </el-upload>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item
                                label="可上传压缩包；其他附件包含：主办方印刷的会议论文集封面、论文集目录、
                            论文集中本人会议论文扫描电子版、海报电子版、报告人宣读论文或海报张贴的会议
                            日程安排电子版（含报告人名字、论文题目）、及其他会议成果（如会议论文期刊发表情况等）"
                                class="topic-form-title"
                                label-position="left"
                            ></el-form-item>
                        </el-col>
                    </el-row>
                    <el-divider></el-divider>
                    <el-row :gutter="24">
                        <el-col :span="9">
                            <el-form-item
                                label="因公出国境任务批件及行程单扫描件"
                                class="topic-form-title"
                                label-width="150px"
                                prop="mark3"
                            >
                                <el-upload
                                    v-model="fileform.mark3"
                                    class="upload-demo"
                                    action="/api/commonservice/obsfile/uploadfile"
                                    :data="uploadConfig.data"
                                    :before-upload="(file) =>beforeUpload(file, 3)"
                                    :on-exceed="handleExceed"
                                    :on-success="(response, file, fileList) => handlerUploadSuccess(response, file, fileList, 3)"
                                    :before-remove="(file, fileList) =>handlerBeforeRemove(file, fileList, 3)"
                                    :on-remove="(file, fileList) =>handlerRemove(file, fileList, 3)"
                                    :on-error="(err, file, fileList) =>handlerUploadError(err, file, fileList, 3)"
                                    :on-preview="(file) =>downloadMaterial(file, 3)"
                                    accept="application/pdf"
                                    multiple
                                    :limit="1"
                                    :file-list="fileList3"
                                    :disabled="ifShowDetail"
                                >
                                    <el-button
                                        size="small"
                                        type="primary"
                                        v-show="!ifShowDetail"
                                    >{{ $t('base.uploadBtn') }}</el-button>
                                </el-upload>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item
                                label="请上传PDF格式文件，大小不要超过5MB（仅允许一个文件）"
                                class="topic-form-title"
                                label-position="left"
                            ></el-form-item>
                        </el-col>
                    </el-row>
                    <el-divider></el-divider>
                    <el-row :gutter="24">
                        <el-col :span="9">
                            <el-form-item
                                label="护照信息页及签证页扫描件"
                                class="topic-form-title"
                                label-width="150px"
                                prop="mark4"
                            >
                                <el-upload
                                    v-model="fileform.mark4"
                                    class="upload-demo"
                                    action="/api/commonservice/obsfile/uploadfile"
                                    :data="uploadConfig.data"
                                    :before-upload="(file) =>beforeUpload(file, 4)"
                                    :on-exceed="handleExceed"
                                    :on-success="(response, file, fileList) => handlerUploadSuccess(response, file, fileList, 4)"
                                    :before-remove="(file, fileList) =>handlerBeforeRemove(file, fileList, 4)"
                                    :on-remove="(file, fileList) =>handlerRemove(file, fileList, 4)"
                                    :on-error="(err, file, fileList) =>handlerUploadError(err, file, fileList, 4)"
                                    :on-preview="(file) =>downloadMaterial(file, 4)"
                                    accept="application/pdf"
                                    multiple
                                    :limit="1"
                                    :file-list="fileList4"
                                    :disabled="ifShowDetail"
                                >
                                    <el-button
                                        size="small"
                                        type="primary"
                                        v-show="!ifShowDetail"
                                    >{{ $t('base.uploadBtn') }}</el-button>
                                </el-upload>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item
                                label="请上传PDF格式文件，大小不要超过5MB（仅允许一个文件）"
                                class="topic-form-title"
                                label-position="left"
                            ></el-form-item>
                        </el-col>
                    </el-row>
                    <el-divider></el-divider>
                    <el-row :gutter="24">
                        <el-col :span="9">
                            <el-form-item
                                label="其他报销材料"
                                class="topic-form-title"
                                label-width="150px"
                                prop="mark5"
                            >
                                <el-upload
                                    v-model="fileform.mark5"
                                    class="upload-demo"
                                    action="/api/commonservice/obsfile/uploadfile"
                                    :data="uploadConfig.data"
                                    :before-upload="(file) =>beforeUpload(file, 5)"
                                    :on-exceed="handleExceed"
                                    :on-success="(response, file, fileList) => handlerUploadSuccess(response, file, fileList, 5)"
                                    :before-remove="(file, fileList) =>handlerBeforeRemove(file, fileList, 5)"
                                    :on-remove="(file, fileList) =>handlerRemove(file, fileList, 5)"
                                    :on-error="(err, file, fileList) =>handlerUploadError(err, file, fileList, 5)"
                                    :on-preview="(file) =>downloadMaterial(file, 5)"
                                    multiple
                                    :limit="1"
                                    :file-list="fileList5"
                                    :disabled="ifShowDetail"
                                >
                                    <el-button
                                        size="small"
                                        type="primary"
                                        v-show="!ifShowDetail"
                                    >{{ $t('base.uploadBtn') }}</el-button>
                                </el-upload>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item
                                label="可上传压缩包"
                                class="topic-form-title"
                                label-position="left"
                            ></el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </el-form>

            <div>
                <hr />
                <div class="edu-opertion-bar">
                    <div class="float-right">
                        <el-button @click="onCancel" v-show="!ifShowDetail">取消</el-button>
                        <el-button type="primary" @click="onSubmit(0)" v-show="!ifShowDetail">保存</el-button>
                        <el-button type="primary" @click="onSubmit(1)" v-show="!ifShowDetail">提交</el-button>
                    </div>
                </div>
            </div>
        </el-card>
        <br />
        <div v-show="ifShowDetail">
            <el-card>
                <span class="topic-form-title">
                    <h3>审批进度</h3>
                </span>
                <edu-table :pagination="false" :data="approveHistory" :selection="false">
                    <edu-table-column prop="time" label="时间" align="center">
                        <template slot-scope="scope">{{scope.row.time | time}}</template>
                    </edu-table-column>
                    <edu-table-column prop="role" label="角色" align="center"></edu-table-column>
                    <edu-table-column prop="approvorName" label="审批人" align="center"></edu-table-column>
                    <edu-table-column prop="result" label="审批结果" align="center">
                        <template slot-scope="scope">{{scope.row.result | result}}</template>
                    </edu-table-column>
                    <edu-table-column prop="content" label="审批说明" align="center"></edu-table-column>
                </edu-table>
            </el-card>
        </div>
    </div>
</template>
<script>
import filters from 'common/src/filters'
import appListOfIntAcaConApi from 'common/src/api/internationalCommunication/appListOfIntAcaCon'
import { downloadfile } from 'common/src/api/upload'
import * as INDEX from 'common/src/utils/index'

export default {
    name: '',
    props: {
        ifShowDetail: {
            type: Boolean,
            default: false
        },
        tranParm: {
            type: Object,
            default: {}
        }
    },
    data() {
        return {
            isExpand: true,
            isReviewExpand: true,
            getSubmitType: '',
            proFormId: '',
            proApplyId: '',
            compareNameList: [],
            approveHistory: [],
            startDatePicker: this.beginDate(),
            endDatePicker: this.processDate(),

            // 动态表单参数
            diyTable: {
                achievements: []
            },
            fileform: {
                mark1: '',
                mark2: '',
                mark3: '',
                mark4: '',
                mark5: '',
                mark6: '',
                mark7: ''
            },
            proForm: {
                id: '',
                studentId: '',
                applyId: '',
                conferenceEndTime: '',
                conferenceStartTime: '',
                realLeaveTime: '',
                realBackTime: '',
                realReadPosterTime: '',
                realReadPosterSubject: '',
                internationalTravel: '',
                trafficExpense: '',
                hotelExpense: '',
                registrationFee: '',
                visaFee: '',
                insurancePremium: '',
                otherExpenses: ''
            },
            submitFileList: [],
            baseInfoRules: {
                realLeaveTime: [{ required: true, message: '请选择', trigger: 'change' }],
                realBackTime: [{ required: true, message: '请选择', trigger: 'change' }],
                realReadPosterTime: [{ required: true, message: '请选择', trigger: 'change' }],
                realReadPosterSubject: [{ required: true, message: '请输入', trigger: 'blur' }]
            },
            fileformRules: {
                mark1: [{ required: true, message: '请上传附件', trigger: 'change' }],
                mark2: [{ required: true, message: '请上传附件', trigger: 'change' }],
                mark3: [{ required: true, message: '请上传附件', trigger: 'change' }],
                mark4: [{ required: true, message: '请上传附件', trigger: 'change' }]
            },
            uploadConfig: {
                data: { bucketname: 'face', folderpath: 'file' }
            }
        }
    },
    filters: {
        time(val) {
            return INDEX.parseTime(val, '{y}-{m}-{d}')
        },
        result(val) {
            switch (val) {
                case 'Process':
                    return '通过'
                case 'Reject':
                    return '驳回'
                case 'Recall':
                    return '撤回'
                case 'End':
                    return '通过'
                case 'COMMIT':
                    return '已提交'
                case 'approveNoPass':
                    return '不通过'
                default:
                    return ' '
            }
        }
    },
    watch: {
        tranParm: {
            handler(newVal) {
                this.proForm.conferenceStartTime = newVal.conferenceStartTime
                this.proForm.conferenceEndTime = newVal.conferenceEndTime
                this.proForm.realReadPosterTime = newVal.realReadPosterTime
                this.proForm.realReadPosterSubject = newVal.realReadPosterSubject
                this.proFormId = newVal.id
                this.proForm.studentId = newVal.studentId
                this.getSubmitType = newVal.submitType
                this.proApplyId = newVal.reimbursementId
            },
            deep: true,
            immediate: true
        }
    },
    created() {},
    mounted() {
        if (this.getSubmitType === 'add') {
            this.proForm.realLeaveTime = ''
            this.proForm.realBackTime = ''
            this.proForm.internationalTravel = ''
            this.proForm.trafficExpense = ''
            this.proForm.hotelExpense = ''
            this.proForm.registrationFee = ''
            this.proForm.visaFee = ''
            this.proForm.insurancePremium = ''
            this.proForm.otherExpenses = ''
            if (this.diyTable.achievements && this.diyTable.achievements.length > 0) {
                this.diyTable.achievements.splice(0, this.diyTable.achievements.length)
            }
        }
        if (this.getSubmitType === 'view' || this.getSubmitType === 'edit') {
            this.getRevDetail()
        }
    },
    methods: {
        // 返回列表页
        returnList() {
            if (this.getSubmitType === 'view') {
                this.$emit('returnVal', 1)
            } else {
                this.$confirm('取消将不会保存当前设置，是否确定?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$emit('returnVal', 1)
                })
            }
        },
        handleExceed(files, fileList) {
            this.$message.error('当前限制只能上传一个文件')
        },
        beginDate() {
            let _this = this
            return {
                disabledDate(time) {
                    if (_this.proForm.realBackTime) {
                        //如果结束时间不为空，则小于结束时间
                        return new Date(_this.proForm.realBackTime).getTime() < time.getTime()
                    } else {
                        // return time.getTime() > Date.now()//开始时间不选时，结束时间最大值小于等于当天
                    }
                }
            }
        },
        processDate() {
            let _this = this
            return {
                disabledDate(time) {
                    if (_this.proForm.realLeaveTime) {
                        //如果开始时间不为空，则结束时间大于开始时间
                        return (
                            new Date(_this.proForm.realLeaveTime).getTime() >
                            time.getTime()  
                        )
                    } else {
                        // return time.getTime() > Date.now()//开始时间不选时，结束时间最大值小于等于当天
                    }
                }
            }
        },
        // 获取报销详情
        getRevDetail() {
            let _this = this
            appListOfIntAcaConApi.getReimbursementDetails(this.proApplyId).then(res => {
                for (let key in res.data) {
                    _this.proForm[key] = res.data[key]
                }
                // if (res.data.achievements) {
                //     res.data.achievements.forEach(ach => {
                //         for (let key in ach) {
                //             if (ach[key] === null) {
                //                 ach[key] = ' '
                //             }
                //         }
                //     })
                // }

                _this.diyTable.achievements = res.data.achievements
                _this.approveHistory = res.data.approveHistory

                if (res.data.file) {
                    _this.fileList5 = []
                    _this.submitFileList = []
                    res.data.file.forEach(val => {
                        _this.submitFileList.push(val)
                        switch (val.number) {
                            case 1:
                                _this.fileList1 = []
                                _this.fileList1.push({ name: val.fileName, fileId: val.fileId })
                                _this.$set(_this.fileform, 'mark1', 1)
                                break
                            case 2:
                                _this.fileList2 = []
                                _this.fileList2.push({ name: val.fileName, fileId: val.fileId })
                                _this.$set(_this.fileform, 'mark2', 2)
                                break
                            case 3:
                                _this.fileList3 = []
                                _this.fileList3.push({ name: val.fileName, fileId: val.fileId })
                                _this.$set(_this.fileform, 'mark3', 3)
                                break
                            case 4:
                                _this.fileList4 = []
                                _this.fileList4.push({ name: val.fileName, fileId: val.fileId })
                                _this.$set(_this.fileform, 'mark4', 4)
                                break
                            case 5:
                                _this.fileList5 = []
                                _this.fileList5.push({ name: val.fileName, fileId: val.fileId })
                                _this.$set(_this.fileform, 'mark5', 5)
                                break
                        }
                    })
                }
            })
        },
        // 新增行
        addLine() {
            if (this.diyTable.achievements.length > 4) {
                this.$message.error('最多只能新增5个学术成果')
            } else {
                this.diyTable.achievements.push({
                    uniqueId: new Date().getTime(),
                    thesisName: '',
                    periodical: '',
                    authorRanking: '',
                    collection: '',
                    issuePage: '',
                    languages: '',
                    partner: ''
                })
            }
        },
        // 删除行
        deleteRoster(row, index) {
            this.diyTable.achievements.splice(index, 1)
        },
        // 保存
        onSave() {
            const params = {
                actionType: this.actionType,
                data: this.basicInfoForm
            }
            this.$emit('topic-save', params)
        },
        // 提交
        onSubmit(status) {
            let _this = this
            let submitParms = {
                id: '',
                reimbursementId: '',
                fileList: [],
                achievementList: []
            }

            _this.$nextTick(() => {
                // 保存是 0   提交是 1
                if (_this.submitFileList) {
                    _this.submitFileList.forEach(val => {
                        submitParms.fileList.push(val)
                    })
                }
                submitParms.approveStatus = status
                submitParms.id = _this.proFormId
                submitParms.reimbursementId = _this.proForm.id
                for (let key in _this.proForm) {
                    if (key !== 'id') {
                        submitParms[key] = _this.proForm[key]
                    }
                }
                _this.diyTable.achievements.forEach(val => {
                    if (
                        val.thesisName !== '' ||
                        val.periodical !== '' ||
                        val.authorRanking !== '' ||
                        val.collection !== '' ||
                        val.issuePage !== '' ||
                        val.partner !== '' ||
                        val.collection !== ''
                    ) {
                        submitParms.achievementList.push(val)
                    }
                })
            })
            _this.$nextTick(() => {
                _this.$refs.proForm.validate(valid => {
                    _this.$refs.fileform.validate(validT => {
                        if (valid && validT) {
                            if (_this.getSubmitType === 'add') {
                                appListOfIntAcaConApi.addReimbursement(submitParms).then(res => {
                                    if (res.code === 200) {
                                        if (status === 0) {
                                            _this.$message({
                                                message: '保存成功',
                                                type: 'success'
                                            })
                                        } else if (status === 1) {
                                            _this.$message({
                                                message: '提交成功',
                                                type: 'success'
                                            })
                                        }

                                        _this.$emit('returnVal', 1)
                                    }
                                })
                            } else if (_this.getSubmitType === 'edit') {
                                appListOfIntAcaConApi.editReimbursement(submitParms).then(res => {
                                    if (res.code === 200) {
                                        if (status === 0) {
                                            _this.$message({
                                                message: '保存成功',
                                                type: 'success'
                                            })
                                        } else if (status === 1) {
                                            _this.$message({
                                                message: '提交成功',
                                                type: 'success'
                                            })
                                        }
                                        _this.$emit('returnVal', 1)
                                    }
                                })
                            }
                        }
                    })
                })
            })
        },

        // 取消
        onCancel() {
            this.$confirm('取消将不会保存当前设置，是否确定?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.$emit('returnVal', 1)
            })
        },
        // 总结模板下载
        downLoadModel() {
            appListOfIntAcaConApi.downloadSummaryTemplate().then(res => {
                this.$message({
                    message: '下载成功',
                    type: 'success'
                })
            })
        },

        handlerBeforeRemove(file, fileList) {
            // if (this.fileFlag) {
            //     return this.$delConfirm().then(_ => {})
            // }
        },
        handlerRemove(file, fileList, value) {
            this.submitFileList.forEach((val, index) => {
                if (value === val.number) {
                    this.submitFileList.splice(index, 1)
                }
            })
            this.compareNameList.forEach((val, index) => {
                if (value === val.number) {
                    this.compareNameList.splice(index, 1)
                }
            })
            this.fileform['mark' + value] = ''
        },
        beforeUpload(file, val) {
            const fileSizeFlag = file.size && file.size / 1024 / 1024 < 5
            let fileType = file.name.substring(file.name.lastIndexOf('.') + 1)
            let uploadFlag = ''
            let fileNameLen = file.name.length < 64
            if (val === 1) {
                uploadFlag = fileType === 'doc' || fileType === 'docx'
            } else if (val === 2 || val === 5) {
                uploadFlag = fileType === 'zip' || fileType === 'rar'
            } else if (val === 3 || val === 4) {
                uploadFlag = fileType === 'pdf'
            }
            let compFileName = true
            this.compareNameList.forEach(val => {
                if (val.fileName === file.name) {
                    compFileName = false
                }
            })
            if (!compFileName) {
                window.vueApp.showMsgBox({
                    message: '已上传相同名称的文件，请修改文件名称后重新上传',
                    callback: () => {}
                })
            }

            if (!uploadFlag) {
                window.vueApp.showMsgBox({
                    message: this.$t('minor.approve.uploadFileError'),
                    callback: () => {}
                })
            }
            if (!fileNameLen) {
                window.vueApp.showMsgBox({
                    message: '上传附件名称超长',
                    callback: () => {}
                })
            }
            if (!fileSizeFlag) {
                window.vueApp.showMsgBox({
                    message: '上传文件大小不能超过5M',
                    callback: () => {}
                })
            }
            this.fileFlag = uploadFlag && fileSizeFlag && fileNameLen && compFileName
            if (!(uploadFlag && fileSizeFlag && fileNameLen && compFileName)) {
                return false
            } else {
                this.compareNameList.push({
                    fileName: file.name,
                    number: val
                })
            }
        },
        handlerUploadSuccess(response, file, fileList, mark) {
            let responseCode = response.code
            if (responseCode === 200) {
                let parm = {
                    number: mark,
                    fileId: Object.values(response.data)[0].objectkey,
                    fileName: Object.values(response.data)[0].fileName
                }
                this.submitFileList.push(parm)
                let test = 'mark' + mark
                this.$set(this.fileform, test, mark)

                let fileds = ''
                switch (mark) {
                    case 1:
                        fileds = 'mark1'
                        break
                    case 2:
                        fileds = 'mark2'
                        break
                    case 3:
                        fileds = 'mark3'
                        break
                    case 4:
                        fileds = 'mark4'
                        break
                    case 5:
                        fileds = 'mark5'
                        break
                }
                this.$refs['fileform'].clearValidate(fileds)
            }
        },
        handlerUploadError(response, file, fileList, value) {
            this.$message({
                message: this.$t('graduateBase.uploadFail'),
                type: 'error'
            })
            this.compareNameList.forEach((val, index) => {
                if (value === val.number) {
                    this.compareNameList.splice(index, 1)
                }
            })
        },
        downloadMaterial(file, val) {
            if (this.submitFileList) {
                this.submitFileList.forEach(fileT => {
                    if (fileT.number === val) {
                        downloadfile(fileT.fileId)
                    }
                })
            } else if (file.status === 'success' && file.response && file.response.data) {
                downloadfile(file.response.data[file.name].objectkey)
            }
        },
        renderHeader(h, para) {
            return h('div', {
                attrs: {
                    class: 'cell'
                },
                domProps: {
                    innerHTML: '收录情况</br>如SCI/EI收录等'
                }
            })
        },
        renderHeader2(h, para) {
            return h('div', {
                attrs: {
                    class: 'cell'
                },
                domProps: {
                    innerHTML: '主要合作者</br>如有校内导师请填写导师姓名'
                }
            })
        },
        renderHeader3(h, para) {
            return h('div', {
                attrs: {
                    class: 'cell'
                },
                domProps: {
                    innerHTML: '卷/期/页</br>著作论文填写'
                }
            })
        },
        renderYear(h, para) {
            return h('div', {
                attrs: {
                    class: 'cell'
                },
                domProps: {
                    innerHTML: '发表时间</br>（年/月）'
                }
            })
        }
    }
}
</script>
<style lang="scss" scoped>
.project-application-container {
    .el-breadcrumb__item:last-child ::v-deep {
        .el-breadcrumb__inner {
            color: #606266;
            font-weight: bold;
            cursor: default;
        }
    }
    .el-breadcrumb__item ::v-deep {
        .is-link {
            color: #aaa;
            font-weight: unset;
        }
        .is-link:hover {
            color: #409eff;
        }
    }
}
.topic-info {
    .topic-title {
        color: #2b3b4e;
        font-size: 18px;
        line-height: 24px;
        font-weight: bold;
    }
    .topic-expand {
        color: #3a7fe8;
        font-size: 14px;
        cursor: pointer;
        margin-left: 10px;
    }
    .topic-input-select {
        width: 100%;
    }
    .topic-form-title {
        font-weight: bold;
        text-align: left;
        line-height: 60px;
    }
    .topic-form-down {
        text-align: left;
        line-height: 60px;
    }
    .top-title {
        font-weight: bold;
        text-align: left;
        line-height: 30px;
    }
    .bottom-btn {
        margin-bottom: 10px;
    }
    .upload-demo {
        text-align: center;
    }
    ::v-deep .el-form-item--small .el-form-item__error {
        padding-top: 5px;
        margin-left: 32%;
    }
}
</style>